<template id="shopInfo">
    <div>
        <el-row>
        <el-col :span="12"><div class="grid-content bg-purple">店铺名称</div></el-col>
        <el-col :span="12"><div class="grid-content bg-purple-light">{{MarketName}}</div></el-col> 
        <el-col :span="12"><div class="grid-content bg-purple">店铺类型</div></el-col>
        <el-col :span="12"><div class="grid-content bg-purple-light">{{MarketType}}</div></el-col>
        <el-col :span="12"><div class="grid-content bg-purple">店铺老板</div></el-col>
        <el-col :span="12"><div class="grid-content bg-purple-light">{{MarketAuthor}}</div></el-col>
        <el-col :span="12"><div class="grid-content bg-purple">店铺邮箱</div></el-col>
        <el-col :span="12"><div class="grid-content bg-purple-light">{{MarketEmail}}</div></el-col>
        <el-col :span="12"><div class="grid-content bg-purple">店铺电话</div></el-col>
        <el-col :span="12"><div class="grid-content bg-purple-light">{{MarketPhone}}</div></el-col>
        </el-row>
    </div>
</template>
<script>
export default {
    data(){
        return{
            MarketName:this.$store.state.marketName,
            MarketType:this.$store.state.marketType,
            MarketAuthor:this.$store.state.marketAuthor,
            MarketEmail:this.$store.state.marketEmail,
            MarketPhone:this.$store.state.marketPhone
        }
    }
}
</script>
<style>
    .el-col {
    border-radius: 4px;
    margin-bottom: 10px;
  }
  .bg-purple {
    background: #d3dce6;
  }
  .bg-purple-light {
    background: #e5e9f2;
  }
  .grid-content {
    border-radius: 4px;
    min-height: 36px;
  }
  .row-bg {
    padding: 10px 0;
    background-color: #f9fafc;
  }
</style>